<template>
	<view class="public-card">
		<u-cell :title="bigTitle" :titleStyle="titleStyle" :arrow="false">
		</u-cell>
		<slot v-if="isSlot"></slot>
		<block v-else v-for="(val,key) in  forKey" :key="key">
			<u-cell :title="forKey[key].title" :valueStyle="{...valueStyle,color:forKey[key].color}"
				:titleStyle="itemTitleStyle" :value="order[key]" :arrow="false">
			</u-cell>
		</block>
	</view>
</template>

<script>
	export default {
		options: {
			styleIsolation: 'shared', // 解除样式隔离
		},
		name: "publicCard",
		props: {

			bigTitle: '',
			order: {
				type: Object,
				default: () => {}
			},
			isSlot: {
				type: Boolean,
				default: false
			},
			forKey: {
				type: Object,
				default: () => {}
			},
		},
		data() {
			return {
				titleStyle: {
					fontSize: '29rpx',
					fontWeight: 'bold',
					color: '#333333',
				},
				itemTitleStyle: {
					fontSize: '25rpx',
					color: '#999999',
					width: '150rpx'
				},
				valueStyle: {
					fontSize: '25rpx',
					color: '#333333',
					whiteSpace: 'pre-wrap'
				}
			}
		},
	}
</script>

<style scoped lang="scss">
	.public-card {
		padding: 0 30rpx !important;
		margin-top: 15rpx;
		background-color: #fff;
		border-radius: 10rpx;
	}

	/deep/.u-cell__body {
		padding-left: 0 !important;
		padding-right: 0 !important;
	}


	/deep/.u-cell-hover {
		background-color: transparent !important;
	}
</style>